define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {

    var Controller = {
        index: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    index_url: 'chatgpt/index' + location.search,
                    add_url: 'chatgpt/add',
                    edit_url: 'chatgpt/edit',
                    del_url: 'chatgpt/del',
                    multi_url: 'chatgpt/multi',
                    import_url: 'chatgpt/import',
                    table: 'chatgpt',
                }
            });

            var table = $("#table");

            // 初始化表格
            table.bootstrapTable({
                url: $.fn.bootstrapTable.defaults.extend.index_url,
                pk: 'id',
                sortName: 'id',
                columns: [
                    [
                        {field: 'avatar', title: __('头像'), events: Table.api.events.image, formatter: Table.api.formatter.image, operate: false},
						{field: 'uid', title: __('Uid'), formatter: Table.api.formatter.status, searchList: Config.users, align: 'left'},
                        /*{field: 'ask', title: __('Ask'), operate: 'LIKE', sortable: true, align: 'LEFT', formatter: function (value, row, index) {
                        	var play  = (row.ask_audio != null) ? '<a href="javascript:;" style="float: right;" onClick="plays(\'' + row.ask_audio + '\'); return false;"><i class="fa fa-volume-up" style="color: red;"></i></a>' : '';
							var pause = (row.ask_audio != null) ? '<a href="javascript:;" style="float: right;" onClick="pause(\'' + row.ask_audio + '\');">&nbsp;&nbsp;<i class="fa fa-pause-circle"></i></a>' : '';
							return '<b>' + value + pause + play + '</b>';                                               
                        }},*/
						{field: 'ask', title: __('Ask'), operate: 'LIKE', sortable: true, align: 'LEFT', formatter: function (value, row, index) {
							if (row.ask_audio){
								var audio  = '<audio src="'+ row.ask_audio +'" controls="controls" preload id="ask_'+ row.id +'" hidden></audio>';
								var button = '<i data-toggle="tooltip" title="播放/暂停" id="bf_'+ row.id +'" class="fa fa-play-circle" style="color: red; float: right; cursor:pointer; font-size:20px;" onclick="bf('+row.id+');">&nbsp;<i title="重播" class="fa fa-stop-circle" style="color: #000;" onclick="rbf('+row.id+');">';
								return '<b>' + value + '</b>' + audio + button;
							}                        	                                               
                        }},
						{field: 'answer', title: __('Answer'), align: 'LEFT', operate: 'LIKE', table: table, class: 'autocontent', formatter: Table.api.formatter.content_audio},
						//{field: 'answer_audio', title: __('Answer'), formatter: Controller.api.formatter.audio},
						{field: 'createtime', title: __('提问时间'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, formatter: Table.api.formatter.datetime},
                        {field: 'updatetime', title: __('回答时间'), operate:'RANGE', addclass:'datetimerange', autocomplete:false, formatter: Table.api.formatter.datetime},
                        {field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}
                    ]
                ]
            });

            // 为表格绑定事件
            Table.api.bindevent(table);
			
        },
        recyclebin: function () {
            // 初始化表格参数配置
            Table.api.init({
                extend: {
                    'dragsort_url': ''
                }
            });

            var table = $("#table");

            // 初始化表格
            table.bootstrapTable({
                url: 'chatgpt/recyclebin' + location.search,
                pk: 'id',
                sortName: 'id',
                columns: [
                    [
                        {checkbox: true},
                        {field: 'id', title: __('Id')},
                        {
                            field: 'deletetime',
                            title: __('Deletetime'),
                            operate: 'RANGE',
                            addclass: 'datetimerange',
                            formatter: Table.api.formatter.datetime
                        },
                        {
                            field: 'operate',
                            width: '140px',
                            title: __('Operate'),
                            table: table,
                            events: Table.api.events.operate,
                            buttons: [
                                {
                                    name: 'Restore',
                                    text: __('Restore'),
                                    classname: 'btn btn-xs btn-info btn-ajax btn-restoreit',
                                    icon: 'fa fa-rotate-left',
                                    url: 'chatgpt/restore',
                                    refresh: true
                                },
                                {
                                    name: 'Destroy',
                                    text: __('Destroy'),
                                    classname: 'btn btn-xs btn-danger btn-ajax btn-destroyit',
                                    icon: 'fa fa-times',
                                    url: 'chatgpt/destroy',
                                    refresh: true
                                }
                            ],
                            formatter: Table.api.formatter.operate
                        }
                    ]
                ]
            });

            // 为表格绑定事件
            Table.api.bindevent(table);
        },

        add: function () {
            Controller.api.bindevent();
        },
        edit: function () {
            Controller.api.bindevent();
        },
        api: {
            bindevent: function () {
                Form.api.bindevent($("form[role=form]"));
            },
            formatter: {//渲染的方法
                audio: function (value, row, index) {
                    if(value != null){
						play  = '<a href="#" onClick="playAudio(\''+value+'\'); return false;"><i class="fa fa-volume-up" style="color: red;"></i></a>';
						pause = '<a href="javascript:;" style="float: right;" onClick="pause(\'' + value + '\');">&nbsp;&nbsp;<i class="fa fa-pause-circle"></i></a>';
                        return play + pause;
                    }
 
                },
            },
        }
    };
    return Controller;
});

function playAudio(url){
    const audio = new Audio(url);
    audio.src = url;
    audio.play();
    return audio;
}

function plays(url){
	url = new Audio(url);
    url.play();
}

function pause(url){
	url = new Audio(url);
    url.pause();
}

function rbf(id){
	var audio = document.getElementById('ask_' + id); 
	audio.currentTime = 0;
}
function bf(id){
	var audio = document.getElementById('ask_' + id);
	var targetClass = $(event.target).attr('class');
	if(targetClass == 'fa fa-play-circle'){
		$('#bf_'+id).attr('class', "fa fa-pause-circle");
		$('#bf_'+id).css('color', '#999');
	} else {
		$('#bf_'+id).attr('class', "fa fa-play-circle");
		$('#bf_'+id).css('color', 'red');
	}	
	if(audio!==null){             
	  //检测播放是否已暂停.audio.paused 在播放器播放时返回false.
	  if(audio.paused)                     {                 
	     audio.play();
	  } else {
	     audio.pause();
	  }
    } else {
		return false;
	}
}

function rbf_answer(id){
	var audio = document.getElementById('answer_' + id); 
	audio.currentTime = 0;
}
function bf_answer(id){
	var audio = document.getElementById('answer_' + id);
	var targetClass = $(event.target).attr('class');
	if(targetClass == 'fa fa-play-circle'){
		$('#bf'+id).attr('class', "fa fa-pause-circle");
		$('#bf'+id).css('color', '#999');
	} else {
		$('#bf'+id).attr('class', "fa fa-play-circle");
		$('#bf'+id).css('color', 'red');
	}	
	if(audio!==null){             
	  //检测播放是否已暂停.audio.paused 在播放器播放时返回false.
	  if(audio.paused)                     {                 
	     audio.play();
	  } else {
	     audio.pause();
	  }
    } else {
		return false;
	}
}



